/*
 * @Author: coman
 * @LastEditors: coman
 * @Date: 2020-06-29 17:33:47
 * @motto: No pain,No gain
 * @LastEditTime: 2020-06-29 21:14:50
 */ 
/*
 * @Author: coman
 * @LastEditors: coman
 * @Date: 2020-06-29 17:33:47
 * @motto: No pain,No gain
 * @LastEditTime: 2020-06-29 19:03:37
 */


window.onload = function () {
    var show = document.querySelector(".shopS");
   
    list_show();
    var total = document.querySelector(".cartall");
    var add = document.querySelectorAll(".add");
    var reduce = document.querySelectorAll(".reduce");
    var num = document.querySelectorAll(".count");
    var priceAll = document.querySelectorAll(".priceAll");
    var saveAll = document.querySelectorAll(".saveAll");
    var del = document.querySelectorAll(".del");
   
    var save = document.querySelector(".savetall");
    // 初始化数量
    sum_pre();

  console.log(total);
  
    
    // 加
    add.forEach((item, index) => {
        item.onclick = () => {
            num[index].value = num[index].value * 1 + 1;
            priceAll[index].innerHTML = (lists[index].nowPrice * num[index].value).toFixed(2);
            saveAll[index].innerHTML = ((lists[index].oriPrice - lists[index].nowPrice) * num[index].value).toFixed(2);
            lists[index].value += 1
            console.log(total_price());
            
        }
    })
    //    减
    reduce.forEach((item, index) => {
        item.onclick = () => {
            if (num[index].value == 0) {
                alert("无法再减了")
            } else {
                num[index].value = num[index].value * 1 - 1;
                priceAll[index].innerHTML = (lists[index].nowPrice * num[index].value).toFixed(2);
                saveAll[index].innerHTML = ((lists[index].oriPrice - lists[index].nowPrice) * num[index].value).toFixed(2);
                // total[index].innerHTML = total_count();
              
                lists[index].value -= 1
                console.log(total);
                
                total.innerHTML = (total_price() * lists[index].nowPrice).toFixed(2) + 'py6.  ';
            }
        }
    })
    // 删除
    del.forEach((item, index) => {
        item.onclick = () => {
            if (confirm("确认删除这件商品吗")) {
                show.removeChild(item.parentNode.parentNode);
            }
           
        }
    })
    function list_show() {
        
        lists.forEach((value, index) => {
            show.innerHTML += `<tr class="shopList">
       <td class="imgTd"><img class="shops" src="../images/${value.img}" alt="" srcset=""></td>
       <td class="titleTd">
           <h6>${lists[index].title}</h6>
           <span>ID:#${lists[index].id}</span>
           <span>Size:${lists[index].size}</span>
       </td>
       <td class="Son2">
           <span class="reduce">-</span>
           <input type="text" value="1" class="count">
           <span class="add">+</span>
       </td>
       <td class="Son3">
           <del class="oriPrice">${lists[index].oriPrice}</del>
           <b class="nowPrice">${lists[index].nowPrice}</b>
       </td>
       <td class="Son4">
           <span class="priceAll">${lists[index].nowPrice}</span>
           <span class="saveAll">${(lists[index].nowPrice - lists[index].oriPrice).toFixed(2)}</span>
       </td>
       <td class="Son5">
           <img class="del" src="../images/del.png" alt="">
       </td>
   </tr>`
        });
    }
    //初始化数量
    function sum_pre() {
        lists.forEach((item, index) => {
            lists[index].value = 1;
        })
    }
    // 计算总价
    function total_price() {
        let sum = 0;
      return  lists.reduce((pre, cur) => {
            return pre + cur.value;
        }, 0)
    }
}

